<% @page_title = "Login Methods"
@identities = current_account.identities_dataset.select_hash(:provider, :uid)
social_login_providers = omniauth_providers.map { |provider,| provider.to_s }
@oidc_identities = @identities.reject { |provider,| social_login_providers.include?(provider) }
@oidc_identity_names = OidcProvider.where(id: @oidc_identities.keys.map! { UBID.to_uuid(it) }).select_hash(:id, :display_name) %>

<%== part("components/page_header", title: "My Account") %>

<main>
  <div class="max-w-screen-xl pb-6 lg:pb-16">
    <div class="overflow-hidden rounded-lg bg-white shadow">
      <div class="divide-y divide-gray-200 lg:grid lg:grid-cols-12 lg:divide-x lg:divide-y-0">
        <%== render("account/submenu") %>
        <div class="divide-y divide-gray-200 lg:col-span-8 xl:col-span-9 2xl:col-span-10 pb-10">
          <% omniauth_providers.each do |provider, name| %>
            <div id="login-method-<%= provider %>" class="px-4 py-6 sm:p-6 lg:pb-8 space-y-4">
              <div class="mt-6 grid grid-cols-6 gap-6">
                <div class="col-span-6 sm:col-span-4">
                  <div class="text-lg font-medium leading-6 text-gray-900">Login with
                    <%= name %></div>
                  <p class="mt-1 text-sm text-gray-500">Connect your
                    <%= name %>
                    to log in to your Ubicloud account</p>
                </div>
                <div class="col-span-6 sm:col-span-2 text-right space-y-1">
                  <% if uid = @identities[provider.to_s] %>
                    <form action="/account/login-method/disconnect" role="form" method="POST" class="grow">
                      <%== csrf_tag("/account/login-method/disconnect") %>
                      <%== part("components/form/hidden", name: "provider", value: provider) %>
                      <%== part("components/form/hidden", name: "uid", value: uid) %>
                      <%== part("components/button", text: "Disconnect", type: "danger") %>
                    </form>
                  <% else %>
                    <form
                      action="<%= rodauth.omniauth_request_path(provider, redirect_url: "/account/login-method") %>"
                      role="form"
                      method="POST"
                      class="grow"
                    >
                      <div class="hidden"><%== rodauth.csrf_tag(rodauth.omniauth_request_path(provider)) %></div>
                      <%== part("components/button", text: "Connect") %>
                    </form>
                  <% end %>
                </div>
              </div>
            </div>
          <% end %>

          <% @oidc_identities.each do |provider, uid| %>
            <% display_name = @oidc_identity_names[UBID.to_uuid(provider)] %>
            <div id="login-method-disconnect-oidc-<%= provider %>" class="px-4 py-6 sm:p-6 lg:pb-8 space-y-4">
              <div class="mt-6 grid grid-cols-6 gap-6">
                <div class="col-span-6 sm:col-span-4">
                  <div class="text-lg font-medium leading-6 text-gray-900">Login with
                    <%= display_name %></div>
                  <p class="mt-1 text-sm text-gray-500">You currently allow your
                    <%= display_name %>
                    account to log in to your Ubicloud account using OIDC</p>
                </div>
                <div class="col-span-6 sm:col-span-2 text-right space-y-1">
                  <form action="/account/login-method/disconnect" role="form" method="POST" class="grow">
                    <%== csrf_tag("/account/login-method/disconnect") %>
                    <%== part("components/form/hidden", name: "provider", value: provider) %>
                    <%== part("components/form/hidden", name: "uid", value: uid) %>
                    <%== part("components/button", text: "Disconnect", type: "danger") %>
                  </form>
                </div>
              </div>
            </div>
          <% end %>

          <div id="login-method-connect-oidc" class="px-4 py-6 sm:p-6 lg:pb-8 space-y-4">
            <form action="/account/login-method/oidc" role="form" method="GET" class="grow">
              <div class="mt-6 grid grid-cols-6 gap-6">
                <div class="col-span-6 sm:col-span-4">
                  <div class="text-lg font-medium leading-6 text-gray-900">Login using an OIDC provider</div>
                  <p class="mt-1 text-sm text-gray-500 mb-2">Allow logging into your Ubicloud account using an OIDC provider</p>
                  <%== part("components/form/text", name: "provider", label: "OIDC Provider ID", attributes: {placeholder: "0p..."}) %>
                </div>
                <div class="col-span-6 sm:col-span-2 text-right space-y-1 mt-8">
                  <%== part("components/button", text: "Connect") %>
                </div>
              </div>
            </form>
          </div>

          <div id="login-method-password" class="px-4 py-6 sm:p-6 lg:pb-8 space-y-4">
            <div class="mt-6 grid grid-cols-6 gap-6">
              <div class="col-span-6 sm:col-span-4">
                <div class="text-lg font-medium leading-6 text-gray-900">Login with Password</div>
                <p class="mt-1 text-sm text-gray-500">
                  <% if rodauth.has_password? %>
                    Change or delete your password. If you delete your password, you can only log in with other
                    methods.
                  <% else %>
                    Create a password to log in to your Ubicloud account
                  <% end %>
                </p>
              </div>
              <div class="col-span-6 sm:col-span-2 text-right space-y-2">
                <%== part("components/button", text: rodauth.has_password? ? "Change" : "Create", link: "/account/change-password") %>
                <% if rodauth.has_password? %>
                  <form action="/account/login-method/disconnect" role="form" method="POST" class="grow">
                    <%== csrf_tag("/account/login-method/disconnect") %>
                    <%== part("components/form/hidden", name: "provider", value: "password") %>
                    <%== part("components/button", text: "Delete", type: "danger") %>
                  </form>
                <% end %>
              </div>
            </div>
          </div>

        </div>
      </div>
    </div>
  </div>
</main>
